<script setup>

import {add} from "echarts/types/dist/shared";
import {ref} from "vue";


let productList = ref({});
const addpro = () => {

}

const batchDel = () => {

}

const handleSelectionChange = () => {

}

//查看详情
const view = () => {


}

//编辑函数
const edit = () => {

}

const del = () => {

}

</script>

<template>
  <el-button type="primary" @click="addpro">添加产品</el-button>
  <el-button type="danger" @click="batchDel">批量删除</el-button>

  <el-table
      :data="productList"
      style="width: 100%"
      @selection-change="handleSelectionChange">
    <el-table-column type="selection" width="55"/>
    <el-table-column type="index" label="序号" width="65"/>
    <el-table-column property="proname" label="产品名称"/>
    <el-table-column property="guide_price_s" label="指导价"/>
    <el-table-column property="quotation" label="现价"/>
    <el-table-column property="createTime" label="创建时间"/>
    <el-table-column label="操作">
      <template #default="scope">
        <el-button type="primary" @click="view(scope.row.id)">详情</el-button>
        <el-button type="success" @click="edit(scope.row.id)">编辑</el-button>
        <el-button type="danger" @click="del(scope.row.id)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
  <el-pagination :background="true"
                 layout="prev, pager, next, jumper, ->, total"
                 :total="total"
                 :page-size="pageSize"
                 @current-change="toPage"/>
</template>

<style scoped>
.el-table {
  margin-top: 15px;
  margin-bottom: 15px;
}
</style>